<template>
	<view class="mentorInfo">
		<div class="card">
			<div class="phot"><image :src="detail.head" mode=""></image></div>
			<div class="com"><image src="../../static/h.png" mode=""></image>香港第一胜任力</div>
			<div class="name">
				<span>{{detail.name}}</span>
				<p>{{detail.job}}</p>
			</div>
			<div class="wx" @tap="previewImage">
				<span>添加老师微信</span>
				<i class="iconfont icontubiaozhizuomoban-13"></i>
			</div>
		</div>
		
		<div class="info">
			<div class="title">关于我</div>
			<div class="cent">
				<p>{{detail.edu}}</p>
				<p>{{detail.desc}}</p>
			</div>
		</div>
		<quick/>
	</view>
</template>

<script>
	import quick from '@/components/quick/index.vue'
	export default {
		components:{
			quick
		},
		data() {
			return {
				detail:''
			};
		},
		onLoad(option) { 
			this.getCoachdetail(option.cid)
			
			if (option.maincode) {
				uni.setStorageSync('maincode', option.maincode);
			}
		},
		onShareAppMessage(){
			let pages = getCurrentPages()
			pages = pages[pages.length-1].route
		    return {
		        title: '弹出分享时显示的分享标题',
		        desc: '分享页面的内容',
		        path: `${pages}?maincode=${this.userInfo.maincode}&id=${this.id}`, // 路径，传递参数到指定页面。
				imageUrl:'@/static/bg.jpg'
		    }
		},
		methods:{
			getCoachdetail(cid){
				this.$api('/api/tcc/getCoachdetail',{cid}).then(res=>{
					this.detail = res
				})
			},
			previewImage(){
				let _this = this
				wx.previewImage({
				  current: _this.detail.wxurl, // 当前显示图片的http链接
				  urls: [_this.detail.wxurl] // 需要预览的图片http链接列表
				})
			}
			
		}
	}
</script>

<style lang="less" scoped>
.mentorInfo{
	background: url(../../static/bg.jpg) no-repeat top;
	background-size: 100% 331rpx;
	min-height: 100vh;
	width: 100%;
	display: inline-block;
	
	.card{
		margin: 55rpx auto 0;
		background: #fff;
		width:660rpx;
		height:453rpx;
		box-shadow:0 0 15rpx 2rpx rgba(0,0,0,0.2);
		border-radius: 30rpx;
		position: relative;
		
		.phot{position: absolute;
			right: 34rpx;
			top: 34rpx;
			image{
				width: 200rpx;
				height: 200rpx;
				border-radius: 30rpx;
			}
		}
		
		.com{
			padding-top: 49rpx;
			line-height: 55rpx;
			color:#666;
			padding-left: 50rpx;
			image{
				margin-right: 18rpx;
				width: 55rpx;
				height: 55rpx;
				vertical-align: middle;
			}
		}
		
		.name{
			padding-left: 50rpx;
			padding-top: 70rpx;
			span{font-size: 50rpx;}
			p{color: #989898;margin-top: 32rpx;}
		}
		
		.wx{
			margin-top: 40rpx;
			border-top: 1rpx solid #ddd;
			line-height: 110rpx;
			display: flex;
			justify-content: space-between;
			padding: 0 50rpx;
			span{
				color: #D30000;
				font-weight: bold;
			}
			.iconfont{
				color: #666666;
				font-size: 60rpx;
			}
		}
	}
}

.info{
	padding: 30rpx 60rpx;
	.title{font-weight: bold;margin-top: 40rpx;}
	.cent{
		font-size: 30rpx;color: #494949;
		p{margin-top: 38rpx;font-size: 30rpx;}
	}
}
</style>
